<div class="layui-card-header layui-card">
    <span class="layui-breadcrumb" lay-filter="breadcrumb">
        <a lay-href="">首页</a>
        <a><cite>商户</cite></a>
        <a><cite>资金流水</cite></a>
    </span>
</div>
<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-tab layui-tab-brief">
			<ul class="layui-tab-title">
				<li class="layui-this">资金流水列表</li>
			</ul>
			<div class="layui-tab-content">
				<div class="layui-row" style="margin-bottom:1%">
					<form action="" id="exportForm" method="post">
						<input name="Authorization" id='exportHiddenInput' type="hidden"/>
						<div class="layui-form" style="float:right;">
							<div id="timeDiv" class="layui-form-item" style="margin:0;">
								<div class="layui-input-inline">
									<input type="text" name="orderId" id="orderId" placeholder="业务单号" autocomplete="off" class="layui-input">
								</div>
								<div class="layui-input-inline">
									<select name="fundDirection" id="fundDirection" lay-search="">
										<option value="">资金变动方向</option>
										<option value="1">加款</option>
										<option value="2">减款</option>
									</select>
								</div>
								<div class="layui-input-inline">
									<select name="bizType" id="bizType" lay-search="">
										<option value="">业务类型</option>
										<option value="1">支付</option>
										<option value="2">提现</option>
										<option value="3">调账</option>
										<option value="4">充值</option>
										<option value="5">差错处理</option>
										<option value="6">代付</option>
									</select>
								</div>
								<div class="layui-input-inline">
									<a id="search" class="layui-btn" data-type="reload"><i class="layui-icon layui-icon-search"></i>搜索</a>
									<button type="submit" class="layui-btn"><i class="layui-icon layui-icon-download-circle"></i>导出</button>
								</div>
							</div>
						</div>
					</form>

				</div>
				<table id="zjlsList"></table>
			</div>
		</div>
	</div>
</div>
<script>
	//标题内容模板
	var tplTitle = function(d){
		return '<a class="layui-btn layui-btn-xs layui-btn-primary" lay-href="account/history/detail/id='+ d.id +'"><i class="layui-icon layui-icon-about"></i>查看</a> '
	};

	layui.use(['table','util','form','timePick'], function(){
		var table = layui.table
				,$ = layui.$
				,form = layui.form
				,timePick = layui.timePick
				,element = layui.element;

		timePick.init();  //第一个参数表示开始时间   第二个表示结束时间   0,0今天   -1,-1昨天   -7,0近一周   以此类推
		element.render('breadcrumb', 'breadcrumb');//渲染导航信息

		//导出参数初始化
		var tokenParamsName = layui.setter.request.tokenName;
		$('#exportHiddenInput').attr('name', tokenParamsName).val(layui.data(layui.setter.tableName)[tokenParamsName]);
		$('#exportForm').attr('action' , layui.setter.baseUrl+'/account/exportExcel');

		var tplAmount = function(d){
			if(d.fundDirection == 1) {
				return "<span style='color: darkgreen'>+ </span>" + d.amount/100;
			}else if(d.fundDirection == 2) {
				return "<span style='color: orangered'>- </span>" + d.amount/100;
			}
		};

		var createTimeStart = $('#createTimeStart').val();
		var createTimeEnd = $('#createTimeEnd').val();
		table.render({
			elem: '#zjlsList'
			,url: layui.setter.baseUrl + '/account/history_list'
			,where: {
				access_token: layui.data(layui.setter.tableName).access_token,
				createTimeStart: createTimeStart,
				createTimeEnd: createTimeEnd
			}
			,id: 'tableReload'
			,cols: [[
				{field: 'balance',title: '变更前余额(元)',templet: '<div>{{d.balance/100}}</div>'}
				,{field: 'amount',title: '变更金额(元)',templet: tplAmount}
				,{field: 'balance',title: '变更后余额(元)',templet: '<div>{{d.afterBalance/100}}</div>'}
				,{field: 'bizType',title: '业务类型',templet: '<div>{{d.bizType == 1?"支付":d.bizType == 2?"提现":d.bizType == 3?"调账":d.bizType == 4?"充值":d.bizType == 5?"差错处理":d.bizType == 6?"代付":""}}</div>'}
				,{field: 'orderId',title: '业务订单' ,width: 270}
				,{field: 'orderAmount',title: '订单金额(元)',templet: '<div>{{d.orderAmount/100}}</div>'}
				,{field: 'fee',title: '手续费(元)',templet: '<div>{{d.fee/100}}</div>'}
				,{field:'createTime',  title: '时间',width: 180, templet: '<div>{{ layui.util.toDateString(d.createTime) }}</div>' }
				/*,{field:'edite', title: '操作', templet: tplTitle }*/
			]]
			,page: true
			,skin: 'line'
		});

		// 搜索
		var $ = layui.$, active = {
			reload: function(){
				var createTimeStart = $('#createTimeStart').val();
				var createTimeEnd = $('#createTimeEnd').val();
				var orderId = $('#orderId').val();
				var fundDirection = $("#fundDirection").val();
				var bizType = $("#bizType").val();
				//执行重载
				table.reload('tableReload', {
					page: {
						curr: 1 //重新从第 1 页开始
					}
					,where: {
						orderId: orderId,
						fundDirection : fundDirection,
						createTimeStart : createTimeStart,
						createTimeEnd : createTimeEnd,
						bizType : bizType
					}
				});
			}
		};
		$('#search').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
			return false;
		});

		// 渲染表单
		form.render();


	})
</script>